import Vue from 'vue'
import Vuex from 'vuex'
import router from '../router';

Vue.use(Vuex)

export default new Vuex.Store({
  //数据源（状态）
  state: {
    count: 0,
    user: {
      UserID: 0,
      Username: '',
      RoleID: 0,
      RoleName: '',
      Token: ''
    },
    shopcart: [
      { id: 1, title: 'iphone14 pro', color: '白', ROM: '128G', price: '7999', number: 1 },
      { id: 2, title: 'hauwei mate 50 Pro', color: '黑', ROM: '256G', price: '6999', number: 1 },
      { id: 3, title: 'xiaomi 13 pro', color: '绿', ROM: '256G', price: '5799', number: 1 }
    ],

    lixi: [
      {
        id: 1,
        title: '请问中华人民共和成立于哪一年？',
        answered: 12,
        option: [
          { id: 11, content: '1948' },
          { id: 12, content: '1949' },
          { id: 13, content: '1950' },
          { id: 14, content: '1951' }
        ]
      }
      , {
        id: 2,
        title: '请问下面那个是是四大发明之一？',
        answered: 23,
        option: [
          { id: 21, content: '电脑' },
          { id: 22, content: '飞机' },
          { id: 23, content: '火药' },
          { id: 24, content: '汽车' }
        ]
      }
      , {
        id: 3,
        title: '请问下面哪部小说是金庸先生写的？',
        answered: 34,
        option: [
          { id: 31, content: '陆小凤' },
          { id: 32, content: '还珠格格' },
          { id: 33, content: '甄嬛传' },
          { id: 34, content: '神雕侠侣' }
        ]
      }
      , {
        id: 4,
        title: '请问下面哪个角色西游记中出现过？',
        answered: 43,
        option: [
          { id: 41, content: '爱坤' },
          { id: 42, content: '坤坤' },
          { id: 43, content: '白骨精' },
          { id: 44, content: '小黑子' }
        ]
      }
    ]
    , lixiscore: 0


    //选中的值
    , tableTabsValue: '2'
    //选项卡 数据
    , editableTabs: []

  },
  //计算属性
  getters: {
    //计算总数量
    totalNumber(state) {
      return state.shopcart.reduce((p, v) => p + v.number, 0);
    }
    //计算总价格
    , totalPrice(state) {
      return state.shopcart.reduce((p, v) => p + v.number * v.price, 0);
    }
  },
  mutations: {
    //登录成功
    setLoginUser(state, user) {
      state.user = user;
      //同时保存到sessionStorage
      sessionStorage.setItem('user', JSON.stringify(user));
    },
    setUser(state, user) {
      state.user = user;
    },
    //退出登录
    setOutUser(state, user) {
      //console.log(user);
      state.user = { uid: 0 };
      sessionStorage.clear();
    },
    //添加购物车
    addCart(state, shop) {
      //判断购物车是否有该商品
      if (state.shopcart.some(v => v.id == shop.id)) {
        state.shopcart.filter(v => v.id == shop.id)[0].number++;
      } else {
        //切断数据同源  对象
        let s = JSON.parse(JSON.stringify(shop))
        s.number = 1;
        state.shopcart.push(s);
      }
    }
    //减数量
    , subtractCart(state, id) {
      let s = state.shopcart.filter(v => v.id == id)[0];
      if (s.number > 1)
        s.number--;
      else {
        let i = state.shopcart.findIndex(v => v.id == id);
        state.shopcart.splice(i, 1);
      }


    }
    , answer(state, subject) {
      let tt = state.lixi.filter(v => v.id == subject.id)[0];
      if (tt.answered == subject.oid)
        state.lixiscore += 25;
    }

    //添加选项卡
    , addTab(state, menu) {
      //先判断当前选项卡 是否存在
      if (!state.editableTabs.some(v => v.name == menu.menuID)) {
        state.editableTabs.push({
          title: menu.menuName,
          name: menu.menuID + '',
          icon: menu.icon,
          viewUrl: menu.vueUrl
        });
      }
      //切换选中
      state.tableTabsValue = menu.menuID + '';

      //通过  tableTabsValue  当前选中选项卡获取 路由地址
      let viewUrl = state.editableTabs.filter(v => v.name == state.tableTabsValue)[0].viewUrl;
      //切换路由
      router.push(viewUrl);

    },
    //移除选项卡
    removeTab(state, targetName) {
      let tabs = state.editableTabs;
      let activeName = state.tableTabsValue;
      //移除的选项卡是当前选中选项卡
      if (activeName === targetName) {
        tabs.forEach((tab, index) => {
          if (tab.name === targetName) {
            let nextTab = tabs[index + 1] || tabs[index - 1];
            if (nextTab) {
              activeName = nextTab.name;
            }
          }
        });
        //通过  tableTabsValue  当前选中选项卡获取 路由地址
        let viewUrl = state.editableTabs.filter(v => v.name == activeName)[0].viewUrl;
        //切换路由
        router.push(viewUrl);
      }
      state.tableTabsValue = activeName;
      //使用筛选移除
      state.editableTabs = tabs.filter(tab => tab.name !== targetName);
    },
    //点击选项卡切换
    clickTab(state) {
      //通过  tableTabsValue  当前选中选项卡获取 路由地址
      let viewUrl = state.editableTabs.filter(v => v.name == state.tableTabsValue)[0].viewUrl;
      //切换路由 
      if (location.pathname != viewUrl)
        router.push(viewUrl);
    }
    , edittableTabsValue(state, value) {
      state.tableTabsValue = value;
    }
  },

  actions: {
    addCartAsync(context, shop) {
      //异步 处理数据库
      context.commit('addCart', shop);
    }
    , subtractCartAsync({ commit }, id) {
      //异步 处理数据库
      commit('subtractCart', id);
    }
  },
  modules: {
  }
})
